<template>
    <div id="bottom">
        <a  id="pause" @click="pauseFun">{{ !paused ? '暂停动画' : '继续动画 ||' }}</a>
        <a  id="skipAnimation" @click="skipAnimationFun">跳过动画</a>
        <p>
            <span id="myGit" v-for="(url,index) in demourl" :key="index">
                <a :href="url.url">{{ url.title }}</a>
            </span>
        </p>
    </div>
</template>
<script>
    export default {
        name: 'bottom',
        data() {
            return {
                demourl: [{
                        url: 'https://gitee.com/wangwenshuoyyds/dashboard/projects',
                        title: '我的码云'
                    }
                ],
                paused: false, //暂停
                audio: ''
            }
        },
        mounted() {

        },
        methods: {
            // 跳过动画
            skipAnimationFun(e) {
                e.preventDefault();
                this.$emit('on-skip');
            },
            // 暂停动画
            pauseFun(e) {
                e.preventDefault();
                this.paused = !this.paused;
                this.$emit('on-pause', this.paused);
            }
        }
    }
</script>

<style scoped>
    #bottom {
        background: #230052;
    }

    #pause {
        font-size: 15px;
        color: #fff;
    }

    #skipAnimation {
        font-size: 15px;
        color: #fff;
    }
</style>